<template>
  <div class="knowledge-add">
    <el-dialog
      :title="title"
      :visible.sync="dialogVisible"
      width="600px"
      @closed="resetForm('form')"
      :close-on-click-modal="false"
    >
      <el-form ref="form" :rules="rules" :model="form" label-width="80px">
        <el-form-item label="视频" prop="fileId">
          <UploadFile
            :fileType="2"
            v-if="dialogVisible"
            @e-fileData="setCoverImgId"
            otherExplain=",文件大小建议在800M以内。"
            class="cover-img-button"
          />
          <p v-if="showName == true && addOrEdit == 2">{{
            newFileData.name
          }}</p>
        </el-form-item>

        <!-- <el-form-item label="融入策略（时间）">
          <el-time-picker
            v-model="form.strategyDate"
            arrow-control
            value-format="HH:mm:ss"
            :picker-options="{
              selectableRange: '00:00:00 - 05:00:00',
            }"
            placeholder="任意时间点"
          >
          </el-time-picker>
        </el-form-item> -->
        <el-form-item label="学时">
          <el-input v-model.trim="form.strategy"  ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="custom" v-preventReClick @click="submitForm('form')"
          >提 交</el-button
        >
        <el-button @click="dialogVisible = false">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  sysKnowledgeAdd,
  sysKnowledgeUpdate,
} from '@/api/admin/courseLibrary/sysKnowledge.js'
import Bus from '@/utils/bus.js'
export default {
  components: {
    EducationSelect: () => import('@/components/educationSelect'),
    CoverImg: () => import('@/components/coverImg'),
    UserFilterSelect: () => import('@/components/userFilterSelect'),
    UploadFile: () => import('@/components/uploadFile'),
  },
  data() {
    return {
      title: '添加视频',
      dialogVisible: false,
      addOrEdit: 1,
      checkedData: {},
      curCourse: '',
      chapterInfo: {}, //节信息
      coverImgInfo: null,
      form: {
        type: this.$route.meta.type,
        name: '', //知识名称
        author: this.$store.getters.username, //作者
        content: '', //内容
        eduId: '', //思政元素ID
        eduTarget: '', //思政目标
        pid: '0', //父级节点
        sourceUnit: '', //提供单位
        strategy: '', //融入策略
        fileId: '',
      },
      rules: {
        name: [
          { required: true, message: '请输入知识点名称', trigger: 'blur' },
        ],
        fileId: [{ required: true, message: '请上传视频', trigger: 'blur' }],
      },
      showName: true,
      newFileData: [],
    }
  },
  mounted() {
    Bus.$on('showDialogKnowledgeAdd', (v) => {
      this.coverImgInfo = null
      if (v.type == 'add') {
        this.form.sysKnowledgeChapterList = [
          {
            chapterId: v.data.id,
            courseId: v.data.courseId,
            type: this.$route.meta.type, //库类型
          },
        ]
        this.handleAddOrEdit(1)
      } else {
        // if (v.row.strategy) {
        //   v.row.strategyDate = v.row.strategy.split(',')[0]
        //   v.row.strategyTxt = v.row.strategy.split(',')[1]
        // }
        var data = JSON.stringify(v.row)
        this.newFileData = JSON.parse(data)
        this.form = JSON.parse(data)

        this.handleAddOrEdit(2)
      }
    })
    Bus.$on('refreshKnowledgeId', (v) => {
      if (v.length > 0) {
        this.form.id = v[0].id
      }
    })
  },
  beforeDestroy() {
    Bus.$off('showDialogKnowledgeAdd')
    Bus.$off('refreshKnowledgeId')
  },
  methods: {
    setEduId(v) {
      this.form.eduId = v
    },
    setCoverImgId(v) {
      if (v) {
        this.form.fileId = v[0].id
        this.form.name = v[0].oldName
      }

      this.showName = false
    },
    setAuthor(v) {
      this.form.author = v
    },
    //显示弹窗
    handleAddOrEdit(type) {
      if (type == 2) {
        this.title = '编辑视频'
        // for (let i in this.checkedData) {
        //   if (this.form.hasOwnProperty(i)) {
        //     this.form[i] = this.checkedData[i] || "";
        //   }
        // }
        // this.coverImgInfo = this.checkedData.hasOwnProperty("sysAttachment")
        //   ? this.checkedData.sysAttachment
        //   : "";
        // this.form.id = this.checkedData.id;
      } else {
        this.title = '添加视频'
        delete this.form.id
      }
      this.addOrEdit = type
      this.dialogVisible = true
    },
    submitForm(form) {
      this.$refs[form].validate((valid) => {
        if (valid) {
          // this.form.strategy =
          //   this.form.strategyDate + ',' + this.form.strategyTxt
          if (this.addOrEdit == 1) {
            if (this.form.id) {
              this.edit()
            } else {
              this.add()
            }
          } else {
            this.edit()
          }
        }
      })
    },
    //新增
    add() {
      sysKnowledgeAdd(this.form).then((res) => {
        this.dialogVisible = false
        Bus.$emit('refreshKnowledgeList')
        this.$message({
          message: '操作成功',
          type: 'success',
        })
      })
    },
    //编辑
    edit() {
      sysKnowledgeUpdate(this.form).then((res) => {
        this.dialogVisible = false
        Bus.$emit('refreshKnowledgeList')
        this.$message({
          message: '操作成功',
          type: 'success',
        })
      })
    },
    //重置表单
    resetForm(form) {
      this.$refs[form].resetFields()
      for (let key in this.form) {
        this.form[key] = ''
      }
      this.form.author = this.$store.getters.username
      this.form.type = this.$route.meta.type
    },
  },
}
</script>